//项目的亮点==》像nust一样可以自动进行配置

// 项目的难点==》扁路由转换成树形

// require.context("路径"，"是否递归引入"，"正则")一次导入多个模块

let files=require.context("@/pages",true,/\.vue$/)

// console.log(files.keys())
// 得到以下数据的数组
// 0: ". /Home/Welcome/ index. vue"
// 1: "./ Home / index.vue"
// 2: "./Login/ commonLogin.vue"
// 3: "./Login/ index.vue"
// 4: "./Login/qrLogin.vue"
// 5: "./Login/smsLogin.vue"length: 6

//创建路由配置
 let repeatRoutes=files.keys().map(path=>{
    //通过正则，去掉index.vue 或者去掉 .vue的后缀
    let regExp=/(\/index\.vue|\.vue)$/

    // 5.获取路径对应的每个.vue组件
    let currentComponent=files(path).default;
    // 解构组件export default 导出的对象中添加的属性
    let {meta,name,redirect}=currentComponent

    path=path.substring(1).replace(regExp,"")//path.substring(1)去掉
    // console.log(path)//得到这样的结果  /Login/qrLogin
    return {
        path:path ? path : "/pages",//一级路径直接使用/home 自身 是根据上面的let paths中的路径决定的
        // 6.重定向，name属性，meta路由元信息 
        meta:meta ?? {},
        name:name ?? path.substring(1).split("/").join("-").toLowerCase(),//名字的格式
        redirect: redirect ?? null,

        component:()=>import("@/pages"+path) //注意这里@/pages/Home"的引用 是根据上面的let paths中的路径决定的
    }
 })

//  console.log(repeatRoutes)
/* ------------------------------------------继续生成树形路由----------------------------------------- */
 function converTree(repeatRoutes){
    repeatRoutes=[...repeatRoutes]//浅拷贝，便于进行操作，防止本身数据发生改变
    let treeRoutes=[];
    //step1. 先给数据添加id和pid
    // 重点：例：父元素自己的id为a-b， 其子元素的pid为a
    repeatRoutes.forEach(route=>{
        // 将路径去掉第一个 / 转换成一个数组 
        let routePathArr=route.path.substring(1).split("/")
        // console.log(routePathArr) //得到一个数组 [Welcome] [a,b] [a]
        //length为1的都是根节点
        //需要添加id和pid

        //正常添加id 
        route.id=routePathArr.join("-")

        if(routePathArr.length>1){
            // 浅拷贝routePathArr;
            let pathArr=[...routePathArr];
            pathArr.pop()
            let pid=pathArr.join("-")
            route.pid=pid 
            //因为length>1 所以数组本身为[a,b,c]的pop完的变成[a,b] pid = a-b 
            // 给这个route[a,b,c]本身 添加父节点id 给其添加pid  id=pid
            // 重点：父元素自己的id为a-b， 其子元素的pid为a
        }
    }) 

    // step2 转换成树形数据
    repeatRoutes.forEach(route=>{//这里的route是例：{path:"/a/b/c",id:"a-b-c",pid:"a-b",component:{} }  
                                                //或者{path:"/a/b",id:"a-b",pid:"a",component:{} } ......
       
    // 4.将所有的路径都变成小写 目的是为了和菜单的高亮效果绑定
    route.path=route.path.toLowerCase()
    //end 配置404页面 对其进行额外处理
    if(route.path==="/page404"){
        route.path="*"
    }
    //父亲在哪？
       let parent = repeatRoutes.find(v=>route.pid===v.id) 
       if(parent){
            if(!parent.children){//如果没有children
                parent.children=[]
            }
            //3.加path属性，
            route.path=route.path.substring(1).split("/").pop() //只取最后一个单词
            parent.children.push(route)//有children的push数组route到children中
       }else{//上面一步push到没有子元素的话 或者 没有子元素的话 直接push
            treeRoutes.push(route)
       }
    })
    return treeRoutes

 }

 let res=converTree(repeatRoutes)
 console.log(res);

 export default [...res]

